<template>
	<article class="media">
		<figure class="media-left image is-48x48">
			<img :src="`https://cn.gravatar.com/avatar/${comment.userId}?s=164&d=monsterid`">
		</figure>
		<div class="media-content">
			<div class="content">
				<p>
					<strong>{{ comment.username }}</strong>
					<span class="is-size-7 ml-2">{{ comment.createdTime | date }}</span>	
				</p>
				<p>{{ comment.commentContent }}</p>
			</div>
		</div>
	</article>
</template>

<script>

export default {
	name: 'CommentsItem',
	
	props: {
		comment: {
			type: Object,
			required: true
		}
	}
}
</script>


